<template>
  <div style="width:100%;display: flex;flex-direction: column;">
    <div class="header">
        <MallHeader />
    </div>
    <div class="main">
        <router-view></router-view>
    </div>
    <div class="footer">
        <Footer />
    </div>
  </div>
</template>

<script>
import MallHeader from './components/MallHeader.vue';
import Footer from './components/Footer.vue';
import Bus from '../../Bus'
import { getUserId } from '@/utils/getUserId';
export default {
    name:'Mall',
    components:{
        MallHeader,
        Footer
    },
    data(){
        return{
            user:{}
        }
    },
    methods:{
        // 页面挂载去本地浏览器取id，取不到则跳转登录界面，取到则发请求给后端获取用户信息
        load(){
            if(!sessionStorage.getItem('user')){
                this.$message.warning('身份信息过期,请重新登录')
                this.$router.push('/login')
            }else{
                let user=JSON.parse(sessionStorage.getItem('user'))
                let token=user.token
                let userId=getUserId(token)
                console.log('userId:',userId);
            }
        }
    },
    mounted(){
        this.load()
    }

}
</script>

<style scoped>
*{
    margin: 0;
    padding: 0;
}
.header{
    width: 100%;
    overflow: hidden;
}

.main{
    /* background-color: orange; */
    width: 100%;
    display: flex;
    overflow: hidden;
}
.footer{
    width: 100%;
    display: flex;
}


</style>